<script setup lang="ts">
// h函数中有三个参数
// 参数1: 是创建的虚拟DOM的节点类型, 一个HTML标签名、一个组件、一个异步组件、或一个函数式组件。
// 参数2: 是一个对象, 这个对象中是对创建的虚拟Dom元素的描述, 没有信息描述可以写null
import XtxMessage from '@/components/message/index.vue'
import { h, render, onMounted } from 'vue';
// 参数3: 虚拟DOM节点中的内容, 可以是字符串也可是数组
const VNode = h(XtxMessage, { type: 'warning' }, '登录失败')
onMounted(() => {
  render(VNode, document.querySelector('.box')!)
})

// 将来要的效果
// Message({ type: 'warning', text: '内容' })
// Message({ type: 'success', text: '内容' })
// Message({ type: 'error', text: '内容' })
</script>
<template>
  <div class="box">
  </div>
</template>
<style scoped lang="less">
</style>